<template>
    <a-sub-menu :key="menuInfo.key" v-bind="$props" v-on="$listeners">
    <span slot="title">
      <icon-font v-if="menuInfo.icon" :type="menuInfo.icon"/>
      <span>{{ $language(menuInfo.title) }}</span>
    </span>
        <template v-for="item in menuInfo.children">
            <a-menu-item @click="OpenPath(item)" v-if="!item.children&&!item.hidden" :key="item.key">
                <icon-font v-if="menuInfo.icon" :type="menuInfo.icon"/>
                <span>{{ $language(item.title) }}</span>
            </a-menu-item>
            <sub-menu v-else :key="item.path" :menu-info="item"/>
        </template>
    </a-sub-menu>
</template>
<script>
    import {Component, Vue, Prop, Emit} from "vue-property-decorator";
    import {Menu} from "ant-design-vue";

    @Component({
        name: "SubMenu",
        isSubMenu: true,
        props: {
            ...Menu.SubMenu.props,
            menuInfo: {
                type: Object,
                default: () => ({})
            }
        },
    })
    export default class SubMenu extends Vue {
        OpenPath(val) {
            this.$router.push({
                name: val.name
            });
            this.$emit("commonPanes", val, false, false);
        }
    }
</script>
